<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="format-detection" content="telephone=no" />
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
		<title>确认支付</title>
		<link rel="stylesheet" type="text/css" href="css/public.css" />
		<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
		<style type="text/css">
			body {
				margin: 0;
				padding: 0;
			}
			
			.header {
				width: 100%;
				background: #0c90d0;
				margin: 0;
				padding: 0;
				text-align: center;
				display: flex;
				justify-content: flex-start;
			}
			
			.header img {
				width: 0.18rem;
				height: 0.18rem;
				margin-top: 0.09rem;
				margin-left: 0.13rem;
			}
			
			.header span {
				font: 0.19rem/0.38rem "";
				color: #fff;
				margin-left: 1.08rem;
			}
			
			.sure_pay {
				width: 88.2%;
				margin: 0 auto;
				margin-top: 0.01rem;
			}
			
			.sure_pay ul {
				width: 100%;
			}
			
			.sure_pay ul li {
				width: 100%;
				height: 0.56rem;
			}
			
			.sure_pay ul li span {
				font-size: 0.15rem;
				color: #252525;
				display: inline-block;
				width: 0.9rem;
			}
			
			.sure_pay ul li s {
				font: 0.15rem/0.56rem "";
				color: #222222;
				display: inline-block;
				margin-left: 0.34rem;
			}
			
			.anniu {
				text-align: center;
			}
		</style>

	</head>

	<body>
		<!--<div class="header">
    <img src="img/fanhui.png" /><span>确认交易</span>
</div>-->
		<div class="sure_pay">
			<ul>
				<li>
					<p style="color: red;font-size: 0.12rem;margin: 0.15rem 0;">
						如果你已经支付成功，请返回首页查看充值记录，避免重复充值！如果尚未支付请核实信息，点击确认购电</p>
				</li>
				<li>
					<span>支付金额：</span><s id="pay_num"></s>
				</li>
				<li style="display: none;">
					<span>身份证：</span><s id="ID_car"></s>
				</li>
				<li>
					<span>表号：</span><s id="Biaohao"></s>
				</li>
				<li>
					<span>房号：</span><s id="Room_num"></s>
				</li>
				<!--<li style="display:none">
					<span>一卡通账号：</span> <input style="display: inline-block;width: 2rem;" id="loginid" type="text" class="form-control" placeholder="请输入账号">
				</li>-->
				<li>
					<span>一卡通密码：</span><input style="display: inline-block;width: 2rem;" id="pwd" type="password" class="form-control" placeholder="请输入密码">
				</li>
			</ul>
			<div class="anniu">
				<button id="sure_buy" type="button" class="btn btn-primary">确认购电</button>
				<button id="fanhui_quer" type="button" class="btn btn-primary">返回首页</button>
				<!--<button id="fanhui_test" type="button" class="btn btn-primary">ceshi</button>-->

			</div>

			<!--<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button>-->
			<!-- 模态框（Modal） -->
			<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" id="close_close" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
							<h4 class="modal-title" id="myModalLabel">提示信息</h4>
						</div>
						<div class="modal-body">扣款成功</div>
						<div class="modal-footer">
							<!--<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>-->
							<button type="button" id="sure_pay" class="btn btn-primary">确定</button>
						</div>
					</div>
					<!-- /.modal-content -->
				</div>
				<!-- /.modal -->
			</div>

			<!--模态框提示信息-->
			<div class="modal fade" id="myModal_tips" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
							<h4 class="modal-title" id="myModalLabel1">提示信息</h4>
						</div>
						<div class="modal-body" id="tips">
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						</div>
					</div>
				</div>
			</div>

		</div>
	</body>

</html>
<script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/common.js" type="text/javascript" charset="utf-8"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	//	$('.header img').click(function() {
	//		location.href = "smart_meter.html"
	//	})
	//	$("#fanhui_test").click(function() {
	//		$('#myModal').modal('show')
	//	})
	var urltest = sessionStorage.getItem("urltest");
	$(function() {
		console.log(urltest)
		var storage = window.localStorage; //获取当前域所对应本地存储区域
		//		var loginid = storage.getItem(loginid);
		//		$("#loginid").val(loginid);
		var canshu = sessionStorage.getItem("canshu");
		var canshu = JSON.parse(canshu);
		$("#pay_num").html(canshu.rctualPayAmount);
		$("#ID_car").html(canshu.identityCard);
		$("#Biaohao").html(canshu.meterId);
		$("#Room_num").html(canshu.roomId);
	})
	$("#fanhui_quer").click(function() {
		window.location.href = "index.html"
	})

	$("#sure_buy").click(function() {

		//		var loginid = $("#loginid").val();
		var pwd = $("#pwd").val();
		if(pwd == "") {
			//			alert("请输入一卡通密码！");
			$("#tips").html("请输入一卡通密码！");
			$('#myModal_tips').modal('show');
			return false;
		} else {
			var storage = window.localStorage; //获取当前域所对应本地存储区域
			//使用setItem(key,value)方法向本地存储区域中写入数据
			//			storage.setItem("loginid", loginid);

		}
		var canshu = sessionStorage.getItem("canshu");
		var canshu = JSON.parse(canshu);
		console.log(canshu);
		//		sessionStorage.getItem("ID_card");
		var identityCard = sessionStorage.getItem("ID_card");
		//		alert(identityCard)
		if(identityCard == null || identityCard == undefined || identityCard == "") {
			//			alert("数据错误请登录后再尝试！")
			$("#tips").html("数据错误请登录后再尝试！");
			$('#myModal_tips').modal('show');
		} else {
			jQuery(function($) {
				var base = function() {
					var identityCard = sessionStorage.getItem("ID_card");;
					var rctualPayAmount = canshu.rctualPayAmount;
					var meterId = canshu.meterId;
					var roomId = canshu.roomId;
					var rate = canshu.rate;
					return {
						identityCard: identityCard,
						meterId: meterId,
						rctualPayAmount: rctualPayAmount,
						roomId: roomId,
						rate: rate,
						//						loginid: loginid,
						pwd: pwd
					}
				}

				var obj = JSON.stringify(base());
				console.log(urltest)
				$.ajax({
					cache: false,
					type: "POST",
					url: urltest + "notcheck/addPayOrder",
					dataType: "json",
					contentType: "application/json;charset=utf-8",
					async: false,
					data: obj,
					success: function(data) {
						if(data.resCode == 200) {
							console.log(data);
							$('#myModal').modal('show');
						} else if(data.resCode == 404) {
							window.location.href = "jq404.html";
						} else {
							//							alert(data.resmsg);
							$("#tips").html(data.resmsg);
							$('#myModal_tips').modal('show');
						}
					},
					error: function(jqXHR) {
						$("#tips").html("发生错误:" + jqXHR.status);
						$('#myModal_tips').modal('show');
					}
				});

			});
		}

	});

	function aa() {
		window.location.href = "Recharge_record.html";
	}
	$("#sure_pay").click(function() {
		aa()
	})
	$("#close_close").click(function() {
		aa()
	})
</script>